const puppeteer = require('puppeteer');

const test = async () => {
    // headless这个属性为ture时，就是一个无界面的浏览器
    let options = {
        // 配置视口的对象
        defaultViewport:{
            width:1400,
            height:800
        },
        // 设置为有界面
        headless:false
    }
    // 创建一个浏览器实例,可以传一个options对象来进行配置
    let browser = await puppeteer.launch(options);

    // 打开浏览器页面
    let page = await browser.newPage();

    // 链接
    let getUrl = "https://www.dyttcn.com/";

    // 访问页面，把链接丢进来
    await page.goto(getUrl);

    // 页面截图
    // await page.screenshot({path:'screenshot.png'});

    // 页面函数获取页面中元素
    let elementsPage = await page.$$eval('#menu ul > li a' , (elements)=>{
        let eleArr = [];
        // 循环遍历
        elements.forEach((item , i) => {
            if (item.getAttribute("href") != '#') {
                // 把获取到的内容存到对象里
                let eleObj  ={
                    // 获取每个元素需要的属性
                    href:item.getAttribute("href"),
                    // 文本内容
                    type:item.innerText
                }
                // 放进数组
                eleArr.push(eleObj);
            }

            // 输入到浏览器中的控制台
            // console.log(item.innerHTML);
        });
        return eleArr
    });

    // 监听事件
    // page.on('console' , (...args)=>{
    //     // 这里是输出到node环境中的控制台
    //     console.log(args);
    // })

    // 再次打开新的页面
    let elepageNew = await browser.newPage();
    await elepageNew.goto(`${getUrl}${elementsPage[2].href}`);

}

test();